﻿
<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" type="text/css" href="css/style.css"/>
    <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="../../lib/jCurveCarousel.min.js"></script>
</head>
<body>

<script type="text/javascript">


    window.carousel = new Carousel();
    $(document).ready(function () {
        window.carousel.init({
            id: 'carousel',
            loader: function (index, direction) {
                if(direction > 0)
                    return $('<div class="barcontainer"><ul class="bar"><li class="barsuccess"><div class="top"></div><div class="bottom" style="height:185px;"></div></li></ul><div class="barbase"><img src="images/shadow.png" /></div></div>');
                else
                    return $('<div class="barcontainer"><ul class="bar"><li class="barerror"><div class="top"></div><div class="bottom" style="height:185px;"></div></li></ul><div class="barbase"><img src="images/shadow.png" /></div></div>');
            }
        });
    });

</script>
	<div id="carousel">
		<div class="barcontainer">

        <ul class="bar">
			<li class="barerror">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
            <li class="barwarning">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
            <li class="barsuccess">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
    </ul>
	<div class="barbase"><img src="images/shadow.png" /></div>
    </div>
    
		<div class="barcontainer">
        <ul class="bar">
			<li class="barerror">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
            <li class="barwarning">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
            <li class="barsuccess">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
    </ul>
	<div class="barbase"><img src="images/shadow.png" /></div>
    </div>
    <div class="barcontainer">
        <ul class="bar">
            <li class="barwarning">
				<div class="top">
				</div>
				<div class="bottom" style="height:185px;">
				</div>
			</li>
        </ul>
		<div class="barbase"><img src="images/shadow.png" /></div>
    </div>
    <div class="barcontainer">

        <ul class="bar">
			<li class="barerror">
				<div class="top">
				</div>
				<div class="bottom" style="height:130px;">
				</div>
			</li>
            <li class="barwarning">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
           
    </ul>
	<div class="barbase"><img src="images/shadow.png" /></div>
    </div>
    <div class="barcontainer">

        <ul class="bar">
			<li class="barerror">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
            <li class="barwarning">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
            <li class="barsuccess">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
    </ul>
	<div class="barbase"><img src="images/shadow.png" /></div>
    </div>
    <div class="barcontainer">

        <ul class="bar">
			<li class="barerror">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
            <li class="barwarning">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
            <li class="barsuccess">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
    </ul>
	<div class="barbase"><img src="images/shadow.png" /></div>
    </div>
    <div class="barcontainer">
        <ul class="bar">
			<li class="barerror">
				<div class="top">
				</div>
				<div class="bottom">
				</div>
			</li>
            
            <li class="barsuccess">
				<div class="top">
				</div>
				<div class="bottom" style="height:124px;">
				</div>
			</li>
    </ul>
	<div class="barbase"><img src="images/shadow.png" /></div>
    </div>
	</div>
</body>
</html>
